import React from "react";
import { ProgressLineProps } from "./interface";
import { handleGradient } from "../helps";
import { ProgressLineStyle } from "./styles";

export const ProgressLine = (props: ProgressLineProps) => {
  const { percent = 0, strokeColor } = props;
  const backgroundProps: React.CSSProperties =
    strokeColor && typeof strokeColor !== "string"
      ? handleGradient(strokeColor)
      : { backgroundColor: strokeColor };

  return (
    <ProgressLineStyle
      percent={percent}
      style={backgroundProps}
    ></ProgressLineStyle>
  );
};
